@import "../../../styles.less";

#main-accrodition {
    color: @black;

    .menu-block {
        white-space: nowrap;
    }

    .devui-accordion-item-title {
        width      : 100%;
        font-weight: 600;
        font-size  : 16px;
    }

    .devui-accordion-splitter {
        display: none;
    }

    .search-detail{
        display:flex;
    }

    .menu-detail {
        margin       : 20px;
        padding-left : 16px;
        padding-right: 16px;
        width        : calc(100% - 36px);
    }

    .menu-detail:hover {
        box-shadow: 0 0 3px 3px @lightest-grey, 0 4px 8px 0 rgba(0, 0, 0, 0.10);
    }

    .cat-units-length {
        display    : inline-block;
        right      : 2px;
        font-size  : 12px;
        color      : @darker-grey;
        font-weight: 400;
    }

    .cat-name {
        display    : inline-block;
        width      : 140px;
        font-weight: 600;
        font-size  : 14px;
    }

    .draggable {
        cursor     : grab;
        user-select: none;
    }

    .draggable:active {
        cursor: grabbing;
    }
}

.tips-block {
    display   : grid;
    text-align: left;
    min-width : 250px;
    max-width : 300px;
    color     : white;
    height    : auto;
    font-size : 16px;
}

.icon-refresh {
    margin-left  : 20px;
    margin-bottom: 5px;
    cursor       : pointer;
}

.title-insert-panel {
    padding-top   : 5px;
    padding-bottom: 5px;
    margin-bottom : 10px;
    font-weight   : 600;
    text-align    : center;
    box-shadow    : 0px 4px 8px@lightest-grey
}

.icon-img{
    .icon();
    background-image: url("../../../assets/img.svg");
}

.icon-video{
    .icon();
    background-image: url("../../../assets/video.svg");
}

.icon-input{
    .icon();
    background-image: url("../../../assets/input.svg");
}

.icon-output{
    .icon();
    background-image: url("../../../assets/output.svg");
}

.icon-common{
    .icon();
    background-image: url("../../../assets/common.svg");
}